
import React, { useState, useEffect } from 'react'
import { Table, Pagination, Button } from 'antd';
import axios from 'axios';
const rowSelection = {
  onChange: (selectedRowKeys, selectedRows) => {

  },
  getCheckboxProps: (record) => ({
    disabled: record.name === 'Disabled User',
    // Column configuration not to be checked
    name: record.name,
  }),
};
const columns = [
  {
    title: '序号',
    dataIndex: 'index',
    key: 'index',
    align: "center",
    fixed: "left",
    width: "5%",
    render: (text, record, index) => {
      return <span style={{ fontSize: "12px" }}>{index + 1}</span>
    }
  },
  {
    title: '产品标识码',
    dataIndex: 'productid',
    key: 'productId',
    align: "center",
    fixed: "left",
    width: "35%",
    render: (text) => {
      return <span style={{ fontSize: "12px" }}>{text}</span>
    }
  },
  {
    title: '产品名称',
    dataIndex: 'productname',
    key: 'productName',
    align: "center",
    fixed: "left",
    render: (text) => {
      return <span style={{ fontSize: "12px" }}>{text}</span>
    }
  },
  {
    title: '类型',
    dataIndex: 'producttype',
    key: 'productType',
    align: "center",
    render: (text) => {
      return <span style={{ fontSize: "12px" }}>{text}</span>
    }
  },
  {
    title: '产品品牌',
    dataIndex: 'productbrand',
    key: 'productBrand',
    align: "center",
    render: (text) => {
      return <span style={{ fontSize: "12px" }}>{text}</span>
    }
  },
  {
    title: "生产日期",
    dataIndex: 'producttime',
    key: 'productTime',
    align: "center",
    className: "wrapTitle",
    width: "10%",
    render: (text) => {
      return <span style={{ fontSize: "12px" }}>{text}</span>
    }
  },

];
export default function QrCodes() {
  const [dataSource, setDataSource] = useState([])
  const [dataTotal, setDataTotal] = useState([])
  const [selectionType, setSelectionType] = useState('checkbox');
  useEffect(() => {
    getData()
  }, [])
  const getData = () => {
    axios.get("/product/selectpro?type=1").then(res => {
      setDataSource(res.data)
      setDataTotal(res.data.length)
    })
  }
  return (
    <div>
      <div style={{ textAlign: "right" }}>
        <Button style={{ color: "black", fontSize: "12px", borderRadius: "4px", margin: "0 0 0 10px" }} onClick={() => { getData() }}>刷新</Button>
      </div>
      <Table
        rowSelection={{
          type: selectionType,
          ...rowSelection,
        }}
        rowKey={(item) => item.id}
        columns={columns} dataSource={dataSource} style={{ margin: "5px 0 0 0" }}
        pagination={{ pageSize: 10 }}
        size='small'
        scroll={{ x: 1200 }}
      >
      </Table>
    </div>
  )
}
